<template>
  <div>
    <el-dialog
      :title="name"
      :visible.sync="dialogTableVisible"
      :close-on-click-modal="false"
      width="1000px">
      <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="90px" :rules="rules">
        <el-form-item label="物料科室" prop="depOffId">
          <el-select
            v-model="queryParams.depOffId"
            placeholder="请选择"
            clearable
            size="small"
          >
            <el-option
              v-for="dict in wlksList"
              :key="dict.id"
              :label="dict.depOffName"
              :value="dict.id"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="物料分类" prop="typeName">
          <el-select v-model="queryParams.typeName" placeholder="请选择物料分类"  style="width: 199px" ref="selectReport">
            <el-option :value="queryParams.id" :label="queryParams.cname" style="width:199px;height:200px;overflow: auto;background-color:#fff">
              <el-tree
                :data="reportData"
                :props="defaultProps"
                @node-click="handleNodeClickSJ"
              ></el-tree>
            </el-option>
          </el-select>


        </el-form-item>
        <el-form-item label="物料编码" prop="mno">
          <el-input
            v-model="queryParams.mno"
            placeholder="请输入物料编码"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="物料名称" prop="mname">
          <el-input
            v-model="queryParams.mname"
            placeholder="请输入物料名称"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="物料规格" >
          <el-input
            v-model="queryParams.mmodel"
            placeholder="请输入物料规格"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="单位" >
          <el-input
            v-model="queryParams.unit"
            placeholder="请输入单位"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="计划价" >
          <el-input
            type="number"
            v-model="queryParams.planPrice"
            placeholder="请输入计划价"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="技术参数" >
          <el-input
            v-model="queryParams.technicalParameters"
            placeholder="请输入技术参数"
            clearable
            size="small"
          />
        </el-form-item>
        <el-form-item label="采购方式"  prop="mtype">
          <el-select
            v-model="queryParams.mtype"
            placeholder="请选择"
            clearable
            size="small"
          >
            <el-option
              v-for="dict in cgfsList"
              :key="dict.dictValue"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="物料状态" prop="purchasingMethod">
          <el-select
            v-model="queryParams.purchasingMethod"
            placeholder="请选择"
            clearable
            size="small"
          >
            <el-option
              v-for="dict in wlztList"
              :key="dict.dictValue"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button  size="small" @click="dialogTableVisible = false">取消</el-button>
        <el-button type="primary"  size="small" @click="determine">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import request from '@/utils/request'
  export default {
    props: ['jihuaData'],
    name: "Role",
    data() {
      return {
        // 表单校验
        rules: {
          mno: [
            {required: true, message: "物料编码不能为空", trigger: "blur"}
          ],
          mname: [
            {required: true, message: "物料名称不能为空", trigger: "blur"}
          ],
          mtype: [
            {required: true, message: "采购方式不能为空", trigger: "blur"}
          ],
          purchasingMethod:[
            {required: true, message: "物料状态不能为空", trigger: "blur"}
          ],
          typeName:[
            {required: true, message: "物料分类不能为空", trigger: "blur"}
          ],
          depOffId:[
            {required: true, message: "物料科室不能为空", trigger: "blur"}
          ],
        },
        reportData:[],
        defaultProps: {
          children: "childList",
          label: "cname"
        },
        name:'新增物料',
        loading:false,
        dialogTableVisible:true,
        //产品查询数据
        queryParams:{
          typeName:'',
          depOffId:'',
          typeId:'',
          mno :'',
          mname:'',
          mmodel:'',
          unit:'',
          planPrice:'',
          technicalParameters:'',
          purchasingMethod:'',
          mtype:'',
        },
        leixng:'post',
        //物料分类
        wlflsList:[],
        newxuanz:'',//当前选中的
        //物料科室
        wlksList:[ ],
        //采购方式
        cgfsList:[
          { value: '1',label: '招标采购'},
          { value: '2',label: '产业协同'},
          { value: '3',label: '战略采购'},
          { value: '4',label: '询比价'},
          { value: '5',label: '长协'},
        ],
        //物料状态
        wlztList:[
          { value: '1',label: '正常'},
          { value: '2',label: '慎用'},
          { value: '3',label: '关闭'},
          { value: '4',label: '新增'},
        ],

      };
    },
    components:{

    },
    watch: {
      dialogTableVisible: function () {
        this.dialogTableVisible = true;//始终让他为true;
        this.cancel();//隐藏
      },
    },
    created() {
      this.name = this.jihuaData.name
      this.leixng = this.jihuaData.leixng
      console.log('计划单',this.jihuaData)
      if(this.leixng=='put'){//编辑
        this.queryParams = this.jihuaData.row
        this.queryParams.purchasingMethod = this.jihuaData.row.purchasingMethod+''
        this.queryParams.mtype = this.jihuaData.row.mtype+''

      }

      this.getTreeselect()
      this.getwlks()
      this.getwlfl()
    },
    methods: {
      handleNodeClickSJ:function(node){
        console.log('111',node)
        this.queryParams.typeId = node.id
        this.queryParams.typeName = node.cname
        this.$refs.selectReport.blur()
        console.log(this.queryParams.typeName,"this.welcomeReport.reportName")
      },
      /** 查询部门下拉树结构 */
      getTreeselect() {
        request({
          url: '/system/classification/listTree',
          method: 'get',
        }).then(response => {
          this.reportData = response.data;
          console.log('成功',response.data)
        });
      },
      //获取物料分类数据
      getwlfl:function(){
        request({
          url: '/system/classification/list',
          method: 'get',
          params: {
            pageNum:'1',
            pageSize:'10000',
          }
        }).then(response => {
          this.wlflsList = response.rows
        });

      },
      //获取物料科室数据
      getwlks:function(){
        request({
          url: '/system/off/list',
          method: 'get',
          params: {
            pageNum:'1',
            pageSize:'10000',
          }
        }).then(response => {
          this.wlksList = response.rows
        });
      },
      //行点击事件
      cellClick:function(row,column,event,cell){
        console.log('row',row)
        this.newxuanz = row.code
      },
      //确定
      determine:function(){
        if(!this.queryParams.mno){
          this.$message({
            type: 'warning',
            message: '物料编码不能为空！'
          });
          return
        }
        if(!this.queryParams.mname){
          this.$message({
            type: 'warning',
            message: '物料名称不能为空！'
          });
          return
        }
        if(!this.queryParams.mtype){
          this.$message({
            type: 'warning',
            message: '采购方式不能为空！'
          });
          return
        }
        if(!this.queryParams.purchasingMethod){
          this.$message({
            type: 'warning',
            message: '物料状态不能为空！'
          });
          return
        }
        if(!this.queryParams.typeName){
          this.$message({
            type: 'warning',
            message: '物料分类不能为空！'
          });
          return
        }
        if(!this.queryParams.depOffId){
          this.$message({
            type: 'warning',
            message: '物料科室不能为空！'
          });
          return
        }

        request({
          url: '/material/supplies',
          method: this.leixng,
          data:this.queryParams
        }).then(response => {

          console.log('确定')
          this.$emit('callback',response)//将submitModel的值传给父组件

        });

      },
      //隐藏
      cancel:function(){
        // this.determine()
        this.$emit('callback','')//将submitModel的值传给父组件
      },
      //分页
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      },


    }
  };
</script>
<style >





</style>
